@import "../../assets/sass/vars";
.fdx-tag {
  background-color: #fff;
  display: inline-block;
  padding: 1px 10px;
  font-size: 12px;
  color: #47a4f3;
  border-radius: 3px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 1px solid #eaf6fc;
  white-space: nowrap;
  line-height: 1;
}
.fdx-tag .fdx-icon-close {
  border-radius: 50%;
  text-align: center;
  position: relative;
  cursor: pointer;
  font-size: 12px;
  height: 16px;
  width: 16px;
  line-height: 16px;
  vertical-align: middle;
  top: -1px;
  right: -5px;
  color: #409eff;
}
.fdx-tag .fdx-icon-close::before {
  display: block;
}
.fdx-tag .fdx-icon-close:hover {
  background-color: #409eff;
  color: #fff;
}
.fdx-tag--info,
.fdx-tag--info .fdx-tag__close {
  color: #909399;
}
.fdx-tag--info {
  background-color: #fff;
  border-color: rgba(184, 184, 249, 0.3);
  color: rgba(114, 114, 231, 0.75);
}
.fdx-tag--info.is-hit {
  border-color: #909399;
}
.fdx-tag--info .fdx-tag__close:hover {
  background-color: #909399;
  color: #fff;
}
.fdx-tag--success {
  background-color: rgba(103, 194, 58, 0.1);
  border-color: rgba(103, 194, 58, 0.2);
  color: #67c23a;
}
.fdx-tag--success.is-hit {
  border-color: #67c23a;
}
.fdx-tag--success .fdx-tag__close {
  color: #67c23a;
}
.fdx-tag--success .fdx-tag__close:hover {
  background-color: #67c23a;
  color: #fff;
}
.fdx-tag--warning {
  // background-color: rgba(230, 162, 60, 0.1);
  border-color: #fdf0e3;
  color: #fc8b27;
}
.fdx-tag--warning.is-hit {
  border-color: #e6a23c;
}
.fdx-tag--warning .fdx-tag__close {
  color: #e6a23c;
}
.fdx-tag--warning .fdx-tag__close:hover {
  background-color: #e6a23c;
  color: #fff;
}
.fdx-tag--danger {
  // background-color: rgba(245, 108, 108, 0.1);
  border-color: #e0f8e4;
  color: rgba(106, 220, 126, 0.9);
}
.fdx-tag--danger.is-hit {
  border-color: #f56c6c;
}
.fdx-tag--danger .fdx-tag__close {
  color: #f56c6c;
}
.fdx-tag--danger .fdx-tag__close:hover {
  background-color: #f56c6c;
  color: #fff;
}
.fdx-tag--medium {
  height: 28px;
  line-height: 26px;
}
.fdx-tag--medium .fdx-icon-close {
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
}
.fdx-tag--small {
  height: 20px;
  padding: 0 8px;
  line-height: 20px;
}
.fdx-tag--small .fdx-icon-close {
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
}
.fdx-tag--mini {
  font-size: 10.5px;
  padding: 3px 4px 3px 4px;
  border-radius: 2px;
}
.fdx-tag--mini .fdx-icon-close {
  margin-left: -3px;
  -webkit-transform: scale(0.7);
  transform: scale(0.7);
}

.fdx-tag--gray{
  background-color: $bg-gray;
  color:$text-gray;
  border-color: $bg-gray;
}

.fdx-tag--blue{
  background-color: rgba(240,248,253,1);
  color:$light-blue;
  border-color: rgba(240,248,253,1);
}

.fdx-tag--red{
  background-color: #FFEAED;
  color:rgba(251,51,83,1);
  border-color: #FFEAED;
}